<template>
   <div>

      
 
      <div class="content">
          <div class="gwc">  <img  class="tp " src="./gwc.png" alt="">
          <p class="wz">您的购物车是空的</p>
        <span class="sy" @click="shouye">去首页看看</span>

          </div>
      </div>

   </div>
        

  
</template>

<script>
export default {
    methods: {
        shouye(){
            this.$router.push('/')
        }
    },
}
</script>

<style>
 
 .content{
     display: flex;
     width: 100%;
     height: 490px;
     position: relative;
     text-align: center;
 }
 .content img{
    width: 120px;
    height: 120px;
 }
 .gwc{
     width: 330px;
     height: 300px;
     margin: 0 auto;
     height: 170px;
   position: relative;
     margin-top: 10%;
 }
 .tp
 {
     width: 140px;
     height: 140px;
     position: absolute;
     left: 10%;
 }
 .sy{
     width: 170px;
     height: 45px;
     background-color: #ff6700;
     text-align: center;
     align-items: center;
     line-height: 45px;
     color: #fff;
     border-radius: 7px;
     position: absolute;
     left: 52%;
     top: 40%;

     cursor: pointer;
 }
 .wz{
     position: absolute;
     top: 15%;
     left: 50%;
     font-size: 18px;
     color: #666;
     margin-left: 18px;
 }
</style>